<template>
    <van-tabs 
    title-active-color="#1d98bd" 
    color="#1d98bd"
    line-width="25"
    v-model="active"
    @change="changeTab">
        <van-tab v-for="(item,index) of topBar" :key="index" :title="item.label"></van-tab>
    </van-tabs>
</template>

<script>
import { Tab, Tabs } from 'vant'
export default {
    props:{
        topBar:Array
    },
    components: {
        [Tab.name]: Tab,
        [Tabs.name]: Tabs,
    },
    data () {
        return {
            active: 0
        }
    },
    computed: {},
    watch: {},
    methods: {
        changeTab(index,title){
            this.$emit('chageTab',index,title)
        }
    },
    created () {},
    mounted () {},
    beforeCreate () {},
    beforeMount () {},
    beforeUpdate () {},
    updated () {},
    beforeDestroy () {},
    destroyed () {},
    activated () {}
}
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类
.van-tabs{
    width: 100%;
    ::v-deep .van-tab{
        font-weight: 600;
    }
}
</style>
